import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:linphone_flutter_example/phone_view_model.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:provider/provider.dart';


class VoicePhone extends StatefulWidget {
  const VoicePhone({Key? key}) : super(key: key);

  @override
  State<VoicePhone> createState() => _VoicePhoneState();
}

class _VoicePhoneState extends State<VoicePhone> {
  List number = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "*", "0", "#"];
  var textCtrl = TextEditingController();
  late PhoneViewModel phoneViewModel;

  @override
  void initState() {
    phoneViewModel = context.read<PhoneViewModel>();
    Future.delayed(const Duration(microseconds: 500), () {
      var phoneNum = ModalRoute.of(context)?.settings.arguments;
      if (phoneNum != null) {
        textCtrl.text = phoneNum as String;
      }
    });
    checkPermission();
    super.initState();
  }

  checkPermission() async {
    bool isMIC = await Permission.microphone.isDenied;
    if (isMIC) {
      Permission.microphone.request();
    }
    bool isNotification =await Permission.notification.isDenied;
    if (isMIC) {
      Permission.notification.request();
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      backgroundColor: Colors.white,
      body: ListView(padding: const EdgeInsets.all(48), children: [
        TextField(
            controller: textCtrl,
            readOnly: true,
            style: const TextStyle(
              fontSize: 40,
              color: Color(0xff333333),
            ),
            decoration: const InputDecoration(
                labelStyle: TextStyle(
              fontSize: 24,
              color: Color(0xffa7a4b8),
            ))),
        const SizedBox(height: 48),
        GridView.builder(
            physics: const NeverScrollableScrollPhysics(),
            shrinkWrap: true,
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
                childAspectRatio: 1,
                mainAxisSpacing: 16,
                crossAxisSpacing: 16),
            itemCount: number.length,
            itemBuilder: (c, i) {
              var s = number[i];
              return button(s);
            }),
        const SizedBox(height: 48),
        bottom()
      ]),
    );
  }

  bottom() {
    return Column(mainAxisSize: MainAxisSize.min, children: [
      Row(mainAxisAlignment: MainAxisAlignment.center, children: [
        const SizedBox(width: 72, height: 72),
        const SizedBox(width: 18),
        InkWell(
            onTap: () {
              if (textCtrl.text == "") {
                EasyLoading.showToast("请输入电话号码");
                return;
              }
              if (phoneViewModel.isCalling) {
                phoneViewModel.transferTo(textCtrl.text);
                Navigator.pop(context);
              } else {
                phoneViewModel.outgoingCall(textCtrl.text);
              }
            },
            child: Container(
              height: 72,
              width: 72,
              decoration: const BoxDecoration(
                borderRadius:
                    BorderRadius.all(Radius.elliptical(9999.0, 9999.0)),
                color: Color(0xff11aa66),
              ),
              child: const Icon(Icons.phone, color: Colors.white, size: 32),
            )),
        const SizedBox(width: 18),
        InkWell(
            onTap: () {
              var text = textCtrl.text;
              textCtrl.text = text.substring(0, text.length - 1);
            },
            child: Container(
                height: 72,
                width: 72,
                alignment: Alignment.center,
                child: Container(
                    height: 32,
                    width: 32,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(4.0),
                      color: const Color(0xfff3f5f7),
                    ),
                    alignment: Alignment.center,
                    child: const Icon(Icons.close)))),
      ]),
      const SizedBox(height: 16),
    ]);
  }

  button(s) {
    return InkWell(
        onTap: () {
          setState(() {
            textCtrl.text = textCtrl.text + s;
          });
        },
        child: Container(
            width: 72,
            height: 72,
            decoration: const BoxDecoration(
              borderRadius: BorderRadius.all(Radius.elliptical(9999.0, 9999.0)),
              color: Color(0xfff3f5f7),
            ),
            alignment: Alignment.center,
            child: Text(
              s,
              style: const TextStyle(
                fontSize: 36,
                color: Color(0xff333333),
              ),
              textAlign: TextAlign.left,
            )));
  }
}
